<template>
  <el-dialog
    title="分配信息"
    :visible.sync="dialogVisible"
    width="70%"
    :destroy-on-close="true"
  >
    <el-row style="margin-bottom: 17px">
      <my-form
        :ref-obj.sync="searchForm.ref"
        :form-opts="searchForm"
        :width-size="2"
        @handleEvent="handleSearchEvent"
      >
        <div slot="right" style="margin-left: 20px">
          <el-button type="primary" @click="submitForm">搜索</el-button>
          <el-button type="warning" @click="resetForm">重置</el-button>
        </div>
      </my-form>
    </el-row>
    <BaseTable
      :has-index="true"
      :has-border="true"
      :table-data="tableData"
      :table-data-total="total"
      :selection-show="false"
      :pagination-show="false"
      :table-column-options="tableColumnOptions"
    />
  </el-dialog>
</template>
<script>
import config from './config'
import BaseTable from '@/components/BaseTable'
import { getAllocation } from '@/api/personnel'

export default {
  components: {
    BaseTable
  },
  data () {
    return {
      dialogVisible: false,
      tableData: [],
      total: 0,
      tableColumnOptions: config.tableColumnOptions,
      searchForm: config.searchForm,
      currentPage: 1,
      id: '',
      // 专家id
      reviewExpert: '',
      // 评委id
      reviewJudges: '',
      historyData: [],
      flag: true
    }
  },
  watch: {
    dialogVisible (newVal) {
      this.searchForm.ref.resetFields()
    }
  },
  created () {},
  methods: {
    open (id) {
      this.id = id
      this.dialogVisible = true
      this.getDistributionList()
    },
    // 分页变化时
    // tableUpdate (e) {
    //   this.currentPage = e.currentPage
    //   this.getDistributionList()
    // },
    // 搜索事件
    submitForm () {
      this.searchForm.ref.validate((valid) => {
        if (!valid) return
        this.getDistributionList()
        console.log(this.searchForm.formData)
      })
    },
    resetForm () {
      this.currentPage = 1
      this.searchForm.ref.resetFields()
      // 清空校验
      this.searchForm.ref.clearValidate()
      this.getDistributionList()
    },
    // 获取分配人员列表
    async getDistributionList () {
      const query = {
        personnel_id: this.id,
        ...this.searchForm.formData
      }
      this.getAllocation(query)
    },
    // 获取人才已分配专家评委列表
    async getAllocation (query) {
      const res = await getAllocation(query)
      this.tableData = res.data
      console.log(res)
    },
    handleSearchEvent () {}
  }
}
</script>
<style lang="scss" scoped>
// ::v-deep.el-form.t-form {
//   justify-content: space-around !important;
// }
</style>
